[GSoC] LateNightQML: Effects Rack - #16884
Conversation
|
|
||
| readonly property bool active: control.value > 0 | ||
| property url activeBackgroundSource: backgroundSource | ||
| property color activeColor: "#888888" |
There was a problem hiding this comment.
Please define colors in res/skins/LateNightQML/LateNightTheme/LateNightTheme.qml
| displayArcStart: LateNightControls.Knob.ArcStart.Minimum | ||
| group: root.group | ||
| height: 26 | ||
| indicatorColor: LateNightTheme.isClassic ? "white" : "grey" |
There was a problem hiding this comment.
Please define colors in res/skins/LateNightQML/LateNightTheme/LateNightTheme.qml
| y: 38 | ||
|
|
||
| Rectangle { | ||
| color: inverseControl.item && inverseControl.item.value > 0 ? "#9c0900" : (LateNightTheme.isClassic ? "#4b4b4b" : "#333333") |
There was a problem hiding this comment.
Please define colors in res/skins/LateNightQML/LateNightTheme/LateNightTheme.qml
| let buttonCount = 0; | ||
| for (let index = 0; index < buttonRepeater.count; ++index) { | ||
| const loader = buttonRepeater.itemAt(index); | ||
| if (loader && loader.active) { | ||
| ++buttonCount; | ||
| } | ||
| } |
There was a problem hiding this comment.
Make clear what is count:
| let buttonCount = 0; | |
| for (let index = 0; index < buttonRepeater.count; ++index) { | |
| const loader = buttonRepeater.itemAt(index); | |
| if (loader && loader.active) { | |
| ++buttonCount; | |
| } | |
| } | |
| let activeButtonCount = 0; | |
| for (let btnIdx = 0; btnIdx < buttonRepeater.count; ++btnIdx ) { | |
| const loader = buttonRepeater.itemAt(btnIdx); | |
| if (loader && loader.active) { | |
| ++activeButtonCount ; | |
| } | |
| } |
| anchors.left: parent.left | ||
| anchors.right: slotControls.left | ||
| anchors.top: parent.top | ||
| border.color: showFocus.value > 0 && Math.round(focusedEffect.value) === root.effectNumber ? LateNightTheme.effectsFocusBorderColor : (LateNightTheme.isClassic ? LateNightTheme.deckPanelBorderDark : "transparent") |
There was a problem hiding this comment.
This is a bit complicated. Can you please make it easier readable.
| MouseArea { | ||
| anchors.fill: parent | ||
|
|
||
| onClicked: root.popup.open() | ||
| } |
There was a problem hiding this comment.
| MouseArea { | |
| anchors.fill: parent | |
| onClicked: root.popup.open() | |
| } |
Please double-check if this is really needed. In general we should use mouse specific behavior only where we don not want allow touch gestures.
| fillMode: Image.Stretch | ||
| source: root.active ? root.activeSource : root.normalSource | ||
| } | ||
| MouseArea { |
There was a problem hiding this comment.
Please check if https://doc.qt.io/qt-6/qml-qtquick-taphandler.html would be better suited here. While LateNight is a mouse centric skin, we should block touch gestures uneccessary.
2 participants
This PR continues the LateNightQML skin work, focusing on bringing the effects rack to feature and visual parity with the legacy LateNight skin for both Classic and PaleMoon color schemes.
Testing the Experimental Skin
Since this is an early experimental milestone, you must first run Mixxx with the developer flag:
Once Mixxx is open, switch to the experimental skin:
Preferences -> Interface -> LateNight QML (Experimental)
You can dynamically toggle between the Classic and PaleMoon color schemes under preferences.
Previews
Classic
PaleMoon
Scope of Changes
Implemented in this PR:
Dependencies
Depends on #16883 and #16858.
Tracking
GSoC: LateNightQML PR-9